<template>
  <div id="user">
    <h1>用户</h1>
    <p>{{msg}} {{$route.params.userId}}</p>
    <button id="userdetail" v-on:click="detailClick">用户详情</button>
    <router-view></router-view>
  </div>
</template>

<script>

export default {
  name: 'user',
  data () {
    return {
      msg: "I'm user, my name is"
    }
  },
  computed: {
    finalMsg () {
      return this.msg + this.$route.params.userId
    }
  },
  methods: {
    detailClick() {
      console.log("clicked");
      let path = this.$route.params.userId + '/detail'
      this.$router.push(path)
    }
  }
}
</script>

<style scoped>

</style>
